import styled from 'styled-components'

export const HomeWrapper = styled.div`
width:960px;
margin:0 auto;
overflow:hidden;
`
export const HomeLeft = styled.div`
margin-left:15px;
width:625px;
float:left;
.banner-img{
    width:625px;
    height:270px;
}
`

export const HomeRight = styled.div`
width:240px;
float:right;
`
export const TopicWrapper = styled.div`
padding:20px 0 10px 0;
overflow:hidden;
margin-left:-16px;
border-bottom:1px solid #dcdcdc;
`
export const TopicItem =styled.div`
float:left;
background:#f7f7f7;
height:32px;
line-height:32px;
font-size:14px;
color:#000;
margin-left:16px;
padding-right:10px;
border:1px solid #dcdcdc;
border-radius:4px;
width: 100px;
margin-bottom:18px;
>.topic-pic{
    width: 32px;
    height: 32px;
    display:block;
    float:left;
    margin-right:10px;
    
}
`
export const ListItem = styled.div`
padding:20px 0;
border-bottom:1px solid #dcdcdc; 
overflow:hidden;
.pic{
    display:block;
    width:125px;
    height:100px;
    float:right;
}
`
export const ListInfo = styled.div`
width:500px;
float:left;
.title{
    font-size:18px;
    line-height:27px;
    font-weight:bold;
    color:#333;
}
.desc{
    margin-right: 20px;
    line-height:24px;
    font-size:13px;
    color:#999;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow:ellipsis;
}
`
export const LoadMore = styled.div`
    width:100%;
    height:40px;
    line-height:40px;
    background:#a5a5a5;
    text-align:center;
    border-radius:20px;
    color:#fff;
    margin:30px 0;
    curcor:pointer;
`
export const BackTop = styled.div`
    position:fixed;
    right:100px;
    bottom:30px;
    width:60px;
    height:60px;
    line-height:60px;
    text-align:center;
    border:1px solid #ccc;
    font-size:14px;
`
